import React, { Component } from "react";
import "./Item.css";
class Item extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }
  render() {
    const { dataItem } = this.props;
    const changeAddrFormat = (value) => {
      if (value && value !== "通程") {
        return "转";
      }
      if (value === "通程") {
        return "通程";
      }
    };
    return (
      <div className="item">
        <div className="itemTop">
          <div className="topInfo">
            <div className="infoTime">{dataItem.startTime.substring(0, 5)}</div>
            <div className="infoAddr">{dataItem.startAddr}</div>
          </div>
          <div className="topInfo">
            <div className="time">
              <span>{dataItem.useTime}</span>
            </div>
            <div className="line">
              <span className="plane-info">
                {changeAddrFormat(dataItem.changeAddr)}
              </span>
            </div>
            <div className="stop-city">
              <span>
                {changeAddrFormat(dataItem.changeAddr) === "转"
                  ? dataItem.changeAddr
                  : ""}
              </span>
            </div>
          </div>
          <div className="topInfo">
            <span className="top-day">{""}</span>
            <div className="infoTime">{dataItem.endTime.substring(0, 5)}</div>
            <div className="infoAddr">{dataItem.endAddr}</div>
          </div>
          <div className="topInfo">
            <div className="infoMon">
              <span className="monIcon">￥</span>
              <span className="mon">{dataItem.money}</span>
            </div>
            <div className="infoTrans">{dataItem.title}</div>
          </div>
        </div>
        <div className="itemBottom">
          <span>{dataItem.airPlane}</span>
        </div>
      </div>
    );
  }
}

export default Item;
